@charset 'UTF-8';
@import '../common/_functions.scss';
@import '../common/_variables.scss';

.integral-buy
{
    margin-top: px2rem(20);

    border-bottom: $border;
    background-color: $_fff;
    .two-col
    {
        display: flex;

        width: px2rem(750);
        height: px2rem(324);

        border-bottom: 2px solid $_eee;

        justify-content: space-between;
        .two-item
        {
            display: block;

            max-width: px2rem(375);
            padding: px2rem(18) 0 px2rem(22) px2rem(30);

            border-left: 2px solid $_eee;

            flex: 1;
            &:first-child
            {
                border-left: none;
            }
            .name
            {
                font-size: px2rem(24);
                line-height: px2rem(32);

                overflow: hidden;

                max-width: px2rem(320);
                height: px2rem(32*2);

                color: $_000;
            }
            .pic
            {
                width: px2rem(180);
                height: px2rem(180);
                margin-left: px2rem(66);
            }
            .price
            {
                font-size: px2rem(24);

                color: $_333;
                span
                {
                    font-size: px2rem(36);

                    color: $_e51d23;
                }
                .extra
                {
                    .operation
                    {
                        font-size: .42667rem;

                        padding: 0 .13333rem;

                        color: #666;
                    }
                    .unit
                    {
                        font-size: .29333rem;

                        color: #333;
                    }
                }
            }
        }
    }
    .three-col
    {
        display: flex;

        width: px2rem(750);
        height: px2rem(402);
        padding: px2rem(25) 0;

        justify-content: space-between;
        .three-item
        {
            display: flex;
            flex-direction: column;

            max-width: px2rem(220);

            flex: 1;
            justify-content: space-between;
            align-items: flex-start;
            .pic
            {
                width: px2rem(220);
                height: px2rem(220);
            }
            .name
            {
                font-size: px2rem(24);
                line-height: px2rem(32);

                overflow: hidden;

                max-width: px2rem(220);
                height: px2rem(32*2);

                color: $_333;
            }
            .price
            {
                font-size: px2rem(22);

                max-width: px2rem(220);

                color: $_333;
                span
                {
                    font-size: px2rem(28);

                    color: $_e51c23;
                }
                .extra
                {
                    .operation
                    {
                        font-size: .42667rem;

                        padding: 0 .13333rem;

                        color: #666;
                    }
                    .unit
                    {
                        font-size: .29333rem;

                        color: #333;
                    }
                }
            }
        }
    }
}
